var imgset=0;
var vidoeset=0;
var page=0;
//记录历史总页数，出现过的总数量
var sum=0;  
//记录当前总页数，即删除后还余下的数量
var pptCount = 0;    
//ppt页计数器
var current_id=0;
//记录各页图片数量
var imgCount = new Array();
//记录各页文本数量
var textCount = new Array();
//记录各页视频框数量
var videoBoxCount = new Array();
//记录各页视频数量
var videoCount = new Array();
//记录ppt页是否被删除（暂未使用）
var is_exist = new Array();
var t=2;
var articleId;
var art_title;
window.onload = function () {
    $("#button_pptCreation").click(function(){
        sum++;          
        pptCount++;    
        var num = pptCount;
        var pptId = 'ppt' + pptCount;  
        var newPpt = '<li><a href="javascript:" id="' + pptId + '"><span class="hidden-xs glyphicon glyphicon-pencil"></span><div class="pull-right visible-lg text-center">第'+pptCount+'页</div></a></li>';
        $("#menu").append(newPpt);
        var content = '<div class="box draggable box0" id="box0"><a href="javascript:" class="img-remove">x</a><span class="r"></span><span class="l"></span><span class="t"></span><span class="b"></span><span class="br"></span><span class="bl"></span><span class="tl"></span><img class="imgi" id="imgid"></div><div class="box draggable box0"><a href="javascript:" class="img-remove">x</a><span class="r"></span><span class="l"></span><span class="t"></span><span class="b"></span><span class="br"></span><span class="bl"></span><span class="tl"></span><img class="imgi" ></div><div class="box draggable box0"><a href="javascript:" class="img-remove">x</a><span class="r"></span><span class="l"></span><span class="t"></span><span class="b"></span><span class="br"></span><span class="bl"></span><span class="tl"></span><img class="imgi" ></div><div class="box draggable box0"><a href="javascript:" class="img-remove">x</a><span class="r"></span><span class="l"></span><span class="t"></span><span class="b"></span><span class="br"></span><span class="bl"></span><span class="tl"></span><img class="imgi" ></div><div class="box draggable box0"><a href="javascript:" class="img-remove">x</a><span class="r"></span><span class="l"></span><span class="t"></span><span class="b"></span><span class="br"></span><span class="bl"></span><span class="tl"></span><img class="imgi" ></div><div class="box draggable box0"><a href="javascript:" class="img-remove">x</a><span class="r"></span><span class="l"></span><span class="t"></span><span class="b"></span><span class="br"></span><span class="bl"></span><span class="tl"></span><img class="imgi" ></div><div class="section ui-widget-content box0"><a href="javascript:" class="img-remove">x</a><input class="upload" id="upload1" type="file" onchange=onUpload2_0(this.files[0])><div class="preview" id="preview1"></div></div><div class="section ui-widget-content box0"><a href="javascript:" class="img-remove">x</a><input class="upload" id="upload1" type="file" onchange=onUpload2_1(this.files[0])><div class="preview" id="preview2"></div></div><div class="section ui-widget-content box0"><a href="javascript:" class="img-remove">x</a><input class="upload" id="upload1" type="file" onchange=onUpload2_2(this.files[0])><div class="preview" id="preview3"></div></div><div class="section ui-widget-content box0"><a href="javascript:" class="img-remove">x</a><input class="upload" id="upload1" type="file" onchange=onUpload2_3(this.files[0])><div class="preview" id="preview4"></div></div><div class="section ui-widget-content box0"><a href="javascript:" class="img-remove">x</a><input class="upload" id="upload1" type="file" onchange=onUpload2_4(this.files[0])><div class="preview" id="preview5"></div></div><div class="section ui-widget-content box0"><a href="javascript:" class="img-remove">x</a><input class="upload" id="upload1" type="file" onchange=onUpload2_5(this.files[0])><div class="preview" id="preview6"></div></div>';
        var newOutbox = '<div class="outbox" id="out' + pptCount + '">' + content + '</div>';
        $(document.body).append(newOutbox);
        //初始化图片记录变量为0
        imgCount[pptCount - 1] = 0;
        //初始化文本记录变量为0
        textCount[pptCount - 1] = 0;
        //初始化视频框记录变量为0
        videoBoxCount[pptCount - 1] = 0;
        //初始化视频记录变量为0
        videoCount[pptCount - 1] = 0;
        //初始化视频记录变量为0
        is_exist[pptCount - 1] = true;
        //添加点击事件，实现选中指定ppt页面
        $("#menu").on("click","#ppt"+num,function(){
        //记录当前选中ppt页数，
        current_id = num;
        for(var i=0;i<pptCount;i++){
        if(i == num-1){
        $(".outbox")[i].style.display="inline";
        }
        else{
        $(".outbox")[i].style.display="none";
        }
            }
        });

        for (var j = 0; j < 6; ++j) {
            var oDiv0 = document.getElementsByClassName('box')[j + (num-1)*6];
            oDiv0.style.width = '200px';
            var imgi = document.getElementsByClassName('imgi');
            var aSpan = oDiv0.getElementsByTagName('span');
            for (var i = 0; i < aSpan.length; i++) {
                 dragFn(aSpan[i],oDiv0);
            }
        }
        });


        var mark = 1, tp = 2;
        var t = 2;
        var T, R, temp;
        
        function dragFn(obj, oDiv) {
            obj.onmousedown = function (ev) {
                var oEv = ev || event;

                var oldWidth = oDiv.offsetWidth;
                var oldHeight = oDiv.offsetHeight;
                var oldX = oEv.clientX;
                var oldY = oEv.clientY;
                var oldLeft = oDiv.offsetLeft;
                var oldTop = oDiv.offsetTop;

                document.onmousemove = function (ev) {
                    var oEv = ev || event;

                    if (obj.className == 'tl') {
                        oDiv.style.width = oldWidth - (oEv.clientX - oldX) + 'px';
                        oDiv.style.height = oldHeight - (oEv.clientY - oldY) + 'px';
                        oDiv.style.left = oldLeft + (oEv.clientX - oldX) + 'px';
                        oDiv.style.top = oldTop + (oEv.clientY - oldY) + 'px';
                    }
                    else if (obj.className == 'bl') {
                        oDiv.style.width = oldWidth - (oEv.clientX - oldX) + 'px';
                        oDiv.style.height = oldHeight + (oEv.clientY - oldY) + 'px';
                        oDiv.style.left = oldLeft + (oEv.clientX - oldX) + 'px';
                        oDiv.style.bottom = oldTop + (oEv.clientY + oldY) + 'px';
                    }
                    else if (obj.className == 'tr') {
                        oDiv.style.width = oldWidth + (oEv.clientX - oldX) + 'px';
                        oDiv.style.height = oldHeight - (oEv.clientY - oldY) + 'px';
                        oDiv.style.right = oldLeft - (oEv.clientX - oldX) + 'px';
                        oDiv.style.top = oldTop + (oEv.clientY - oldY) + 'px';
                    }
                    else if (obj.className == 'br') {
                        oDiv.style.width = oldWidth + (oEv.clientX - oldX) + 'px';
                        oDiv.style.height = oldHeight + (oEv.clientY - oldY) + 'px';
                        oDiv.style.right = oldLeft - (oEv.clientX - oldX) + 'px';
                        oDiv.style.bottom = oldTop + (oEv.clientY + oldY) + 'px';
                    }
                    else if (obj.className == 't') {
                        oDiv.style.height = oldHeight - (oEv.clientY - oldY) + 'px';
                        oDiv.style.top = oldTop + (oEv.clientY - oldY) + 'px';
                    }
                    else if (obj.className == 'b') {
                        oDiv.style.height = oldHeight + (oEv.clientY - oldY) + 'px';
                        oDiv.style.bottom = oldTop - (oEv.clientY + oldY) + 'px';
                    }
                    else if (obj.className == 'l') {
                        oDiv.style.height = oldHeight + 'px';
                        oDiv.style.width = oldWidth - (oEv.clientX - oldX) + 'px';
                        oDiv.style.left = oldLeft + (oEv.clientX - oldX) + 'px';
                    }
                    else if (obj.className == 'r') {
                        oDiv.style.height = oldHeight + 'px';
                        oDiv.style.width = oldWidth + (oEv.clientX - oldX) + 'px';
                        oDiv.style.right = oldLeft - (oEv.clientX - oldX) + 'px';
                    }
                };

                document.onmouseup = function () {
                    document.onmousemove = null;
                };
                return false;
            };
        }
   
};
    
var tmpi=0;

function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

//记录当前放映的ppt编号
var current_show,is_show;
var ppttime;
$(document).ready(function(){
    articleId= getUrlVars()["id"];
    ppttime=getUrlVars()["time"];
    art_title=getUrlVars()["title"];
    $("#get").click();
    //开始放映
    $("#play_start").on("click",function(){
    for(var i=0;i<pptCount;i++){
        $(".outbox")[i].style.display="none";
    }
        current_show = 0;
        is_show = true;
        var int=self.setInterval("clock()",ppttime); 
    });
 
   //结束放映
    $("#play_end").on("click",function(){
        is_show = false;
    });
    $("#play_start").click();
});

//out_name为当前放映页面的id
var out_name;
    function clock()
    {
     //停止放映
     if(!is_show){
     clearInterval(int);
}
     for(var i=0;i<pptCount;i++){
     if(i == current_show){  
     if(i == 0){ 
    out_name = "out" + (pptCount);
    //淡入、淡出时间为800ms
    $("#" + out_name).fadeOut(800);
}
     else{
    out_name = "out" + (i);
    $("#" + out_name).fadeOut(800);  
}
     //此处逻辑为前一页先消失，后一页再出现
    out_name = "out" + (i+1);
    $("#" + out_name).fadeIn(800);
  }
}
     current_show++;
     //若页数计数超出总页数，从第1页开始放映，另起循环
     if(current_show==pptCount)
     current_show = 0;
}